<style scoped>
  .rj-topbar {
    height: 50px; line-height: 50px; background: #f7f7f7; text-align: center; font-size: 16px; border-bottom: 1px solid #bdbbbc; position: relative
  }
  .list {
    background: #eee;
  }
  .weui-form-preview {
    background-color: #fff;
    margin: 5px;
    border-radius: 5px;
  }
  .weui-form-preview__hd label, .weui-form-preview__hd em {
    font-size: .9em !important;
  }
  .weui_navbar_item {
    font-size: 14px;
  }
  .weui_navbar_item.weui_bar_item_on {
    color: #3cc51f;
  }
  .weui-loadmore_line .weui-loadmore__tips {
    background-color: #eee;
  }
  .list {
    overflow: auto;
  }
  .rj-cell {
    display: inline-block;
    font-size: 0;
    padding: 5px 15px;
  }
  .rj-cell.max span{
    font-size: 16px;
    padding-right: 20px;
  }
  .rj-cell.minpad{
    padding-right: 10px !important;
  }
  .rj-cell label {
    color: #333;
    font-size: 14px;
  }
  .rj-cell span {
    padding-left: 5px;
    font-size: 14px;
    color: #333;
  }
  .rj-cell.note{
    width: 100%;
  }
  .rj-cell.note label{
    float: left;
  }
  .rj-cell.note span{
    width: 80%;
    display: inline-block;
  }
  .weui-cells {
    margin-top: 0;
  }
  .rj-wrap {
    background: #eee;
    overflow:auto;overflow-x: hidden
  }
  .rj-cont {
    background: #fff;
  }
  .weui-panel {
    background: #eee;
  }
  .rj-cont-tit {
    margin: 0;
    border-radius: 0;
  }
  .weui-panel {
    margin-top: 0;
    text-align: left;
  }
  .demos-content-padded {
    padding: 15px;
  }
  .attachimg {
    /*width: 100%;*/
  }
  .tipp {
    position: absolute;top: 0px;background: rgba(255,0,0,0.5);color:#fff;display: inline-block;width: 85px;text-align: center;
  }
  .rj-cell-child-tit {
    background: #f9f9f9;
    font-size: 14px;
    padding: 5px 15px;
    border-bottom: 1px solid #eee;
  }
  .tit label, .tit span {
    font-size: 16px;
  }
  .tit label {
    padding-right: 20px;
  }
  .weui-panel.weui-panel_access {
    padding-bottom: 10px;
  }
  .weui-panel__bd:not(.base) {
    width: 98%;
    padding: 0 1% 2px 1%;
  }
  .rj-cont-tit:not(.base) {
    border-radius: 5px;
  }
</style>
<template>
  <div class="viewpage">
    <div style="height: 50px; line-height: 50px; background: #f7f7f7; text-align: center; font-size: 16px; border-bottom: 1px solid #bdbbbc; position: relative">
      生产计划详情
      <a href="javascript:;" @click="$router.back(-1)" style="position: absolute; left: 10px; top: 8px">
        <img src="../../assets/back.png" style="width: 20px" />
      </a>
    </div>
    <div class="weui-panel weui-panel_access">
      <div class="weui-panel__bd base">
        <div class="weui-form-preview billitem rj-cont-tit base">
          <div class="rj-cell max">
            <label>编号：</label>
            <span>{{plan.code}}</span>
          </div>
          <div class="rj-cell max">
            <label>名称：</label>
            <span>{{plan.name}}</span>
          </div>
          <div class="rj-cell max">
            <label>库房：</label>
            <span>{{plan.strname}}</span>
          </div>
          <div class="rj-cell max">
            <label>计划日期：</label>
            <span>{{plan.planstart}}</span>
          </div>
          <div class="rj-cell max">
            <label>状态：</label>
            <span>{{plan.statusname}}</span>
          </div>
        </div>
      </div>
      <div class="weui-panel__hd" v-if="plsCollect.length > 0">领料信息</div>
      <div class="weui-panel__bd" v-for="(item, index) in plsCollect">
        <div class="weui-form-preview billitem rj-cont-tit">
<!--          <div class="rj-cell max">-->
<!--            <label>库房：</label>-->
<!--            <span>{{item.departmentname}}</span>-->
<!--            <span>{{item.strname}}</span>-->
<!--          </div>-->
          <div class="rj-cell max">
            <label>领料单数量：</label>
            <span>{{item.num}}</span>
          </div>
          <div class="rj-cell max">
            <label>合计重量(吨)：</label>
            <span>{{item.weightall}}</span>
          </div>
        </div>
      </div>
      <div class="weui-panel__hd" v-if="pls.length > 0">领料详情</div>
      <div class="weui-panel__bd" v-for="(item, index) in pls">
        <div class="weui-form-preview billitem rj-cont-tit">
          <div class="rj-cell max">
            <label>编号：</label>
            <span>{{item.code}}</span>
          </div>
          <div class="rj-cell max">
            <label>库房：</label>
            <span>{{item.strname}}</span>
<!--            <span>{{item.departmentname}}</span>-->
          </div>
<!--          <div class="rj-cell max">-->
<!--            <label>重量(吨)：</label>-->
<!--            <span>{{item.weightsum}}</span>-->
<!--            <span>{{item.statusname}}</span>-->
<!--          </div>-->
<!--          <div class="rj-cell max">-->
<!--            <label>提交人：</label>-->
<!--            <span>{{item.operatorName}}</span>-->
<!--          </div>-->
          <div class="rj-cell max">
            <label>状态：</label>
            <span>{{item.statusname}}</span>
          </div>
          <div  v-for="(product, index) in item.items" :key="product.guid">
            <div class="rj-cell max">
              <label><span style="font-size: 14px;padding: 0;">产品：</span></label>
              <span>{{product.sthname}}</span>
              <span>{{product.product}}</span>
              <span>{{product.weight}} 吨</span>
            </div>
<!--            <div class="rj-cell max">-->
<!--              <label><span style="font-size: 14px;padding: 0;">产品：</span></label>-->
<!--              <span>{{product.product}}</span>-->
<!--              <span>{{product.spename}}</span>-->
<!--            </div>-->
<!--            <div class="rj-cell max">-->
<!--              <label>重量：</label>-->
<!--              <span>{{product.weight}} 吨</span>-->
<!--            </div>-->
          </div>
        </div>
      </div>
      <div class="weui-panel__hd" ref="qaformTitle" v-show="hgsum > 0">入库信息</div>
      <div class="weui-panel__bd" v-show="hgsum > 0">
        <div class="weui-form-preview billitem rj-cont-tit">
          <div style="border-top: 1px solid #eee;">
            <div  >
              <div class="rj-cell max">
                <label><span style="font-size: 14px;padding: 0;">入库单数量：</span></label>
                <span>{{hgsum}} 个</span>
                <span>{{hgweight}} 吨</span>
              </div>
            </div>
<!--            <div class="rj-cell max">-->
<!--              <label> 次品入库单数量 ：</label>-->
<!--              <span>{{bhgsum}} 个</span>-->
<!--              <span>{{bhgweight}} 吨</span>-->
<!--            </div>-->
          </div>
        </div>
      </div>
      <div class="weui-panel__hd" v-show="whinforms.length > 0">入库详情</div>
      <div class="weui-panel__bd" v-for="(item, index) in whinforms">
        <div class="weui-form-preview billitem rj-cont-tit">
          <div class="rj-cell max tit">
            <label>编号：</label>
            <span>{{item.code}}</span>
          </div>
<!--          <div class="rj-cell max tit">-->
<!--            <label>所属公司：</label>-->
<!--            <span>{{item.orgname}}</span>-->
<!--          </div>-->
          <div class="rj-cell max tit">
            <label>入库库房：</label>
            <span>{{item.strname}}</span>
          </div>
<!--          <div class="rj-cell max tit">-->
<!--            <label>库房类型：</label>-->
<!--            <span>{{item.type == 1 ? '产成品库' : '次品库'}}</span>-->
<!--          </div>-->
<!--          <div class="rj-cell max tit">-->
<!--            <label>重量(吨)：</label>-->
<!--            <span>{{item.qty}}</span>-->
<!--          </div>-->
<!--          <div class="rj-cell max tit">-->
<!--            <label>质检结果：</label>-->
<!--            <span>{{item.qaformRsult == 1 ? '合格' : '不合格'}}</span>-->
<!--          </div>-->
<!--          <div class="rj-cell max tit">-->
<!--            <label>提交人：</label>-->
<!--            <span>{{item.operator}}</span>-->
<!--          </div>-->
          <div class="rj-cell max tit">
            <label>状态：</label>
            <span>{{whinformStatus(item.status)}}</span>
          </div>
          <div  v-for="(product, index) in item.items" :key="product.guid">
            <div class="rj-cell max">
              <label><span style="font-size: 14px;padding: 0;">产品：</span></label>
              <span>{{product.housename}}</span>
              <span>{{product.product}}</span>
              <span>{{product.weight}} 吨</span>
              <!--              <span>{{product.spename}}</span>-->
            </div>
<!--            <div class="rj-cell max">-->
<!--              <label>重量：</label>-->
<!--              <span>{{product.weight}} 吨</span>-->
<!--            </div>-->
          </div>
        </div>
      </div>
      <div class="weui-panel__hd" v-if="scrapsum > 0">报废信息</div>
      <div class="weui-panel__bd" v-if="scrapsum > 0">
        <div class="weui-form-preview billitem rj-cont-tit">
          <div class="rj-cell max">
            <label>报废单数量：</label>
            <span>{{scrapsum}}</span>
          </div>
          <div class="rj-cell max">
            <label>合计重量(吨)：</label>
            <span>{{scrapweight}}</span>
          </div>
        </div>
      </div>
      <div class="weui-panel__hd" v-if="scraps.length > 0">报废详情</div>
      <div class="weui-panel__bd" v-for="(item, index) in scraps">
        <div class="weui-form-preview billitem rj-cont-tit">
          <div class="rj-cell max">
            <label>编号：</label>
            <span>{{item.code}}</span>
          </div>
<!--          <div class="rj-cell max" v-for="(product, index) in item.items" :key="product.guid">-->
<!--            <label>产品：</label>-->
<!--            <span>{{product.product}}</span>-->
<!--            <span>{{product.weight}} 吨</span>-->
<!--          </div>-->
<!--          <div class="rj-cell max">-->
<!--            <label>提交人：</label>-->
<!--            <span>{{item.operator}}</span>-->
<!--          </div>-->
          <div class="rj-cell max">
            <label>状态：</label>
            <span>{{statusname(item.status)}}</span>
          </div>
          <div  v-for="(product, index) in item.items" :key="product.guid">
            <div class="rj-cell max">
              <label><span style="font-size: 14px;padding: 0;">产品：</span></label>
              <span>{{product.housename}}</span>
              <span>{{product.product}}</span>
              <span>{{product.weight}} 吨</span>
              <!--              <span>{{product.spename}}</span>-->
            </div>
<!--            <div class="rj-cell max">-->
<!--              <label>重量：</label>-->
<!--              <span>{{product.weight}} 吨</span>-->
<!--            </div>-->
          </div>
        </div>
      </div>
      <div class="weui-panel__hd" v-if="materialsum > 0">退料信息</div>
      <div class="weui-panel__bd" v-if="materialsum > 0">
        <div class="weui-form-preview billitem rj-cont-tit">
          <div class="rj-cell max">
            <label>退料单数量：</label>
            <span>{{materialsum}}</span>
          </div>
          <div class="rj-cell max">
            <label>合计重量(吨)：</label>
            <span>{{materialweight}}</span>
          </div>
        </div>
      </div>
      <div class="weui-panel__hd" v-if="materials.length > 0">退料详情</div>
      <div class="weui-panel__bd" v-for="(item, index) in materials">
        <div class="weui-form-preview billitem rj-cont-tit">
          <div class="rj-cell max">
            <label>编号：</label>
            <span>{{item.code}}</span>
          </div>
          <div class="rj-cell max">
            <label>库房：</label>
            <span>{{item.srName}}</span>
          </div>
<!--          <div class="rj-cell max" v-for="(product, index) in item.matretapplyitems" :key="product.guid">-->
<!--            <label>产品：</label>-->
<!--            <span>{{product.productName}}</span>-->
<!--            <span>{{product.weight}} 吨</span>-->
<!--          </div>-->
<!--          <div class="rj-cell max">-->
<!--            <label>提交人：</label>-->
<!--            <span>{{item.operatorName}}</span>-->
<!--          </div>-->
          <div class="rj-cell max">
            <label>状态：</label>
            <span>{{item.statusName}}</span>
          </div>
          <div  v-for="(product, index) in item.items" :key="product.guid">
            <div class="rj-cell max">
              <label><span style="font-size: 14px;padding: 0;">产品：</span></label>
              <span>{{product.shname}}</span>
              <span>{{product.productName}}</span>
              <span>{{product.weight}} 吨</span>

              <!--              <span>{{product.spename}}</span>-->
            </div>
<!--            <div class="rj-cell max">-->
<!--              <label>重量：</label>-->
<!--              <span>{{product.weight}} 吨</span>-->
<!--            </div>-->
          </div>
        </div>
      </div>
      <OperationLogs :orderid="id"></OperationLogs>
    </div>
  </div>
</template>

<script>
  import OperationLogs from '../common/OperationLogs'

  export default {
  name: 'ViewPlan',
  data () {
    return {
      openid: localStorage.openid,//'oIuV2v77MaLCAQILhjI6h6oTWpHI',
      userid: localStorage.userid,//'oIuV2v77MaLCAQILhjI6h6oTWpHI',
      id: '',
      plan: {},
      plsCollect: [],
      pls: [],
      hgweight: 0,
      hgsum: 0,
      bhgweight: 0,
      bhgsum:0,
      whinforms: [],
      scrapsum: 0,
      scrapweight:'',
      scraps: [],
      materialsum: '',
      materialweight: '',
      materials: []
    }
  },
    components: {
      OperationLogs
    },
  created() {
    window.addEventListener('setItem', ()=> {
      this.openid = localStorage.getItem('openid');
      this.userid = localStorage.getItem('userid');
    })
  },
  mounted () {

    this.id = this.$route.query.id;
    this.getPlan(this.id);

    //图片浏览器
    $('.weui-panel').on('click', '.uploaderFiles .attachimg', function () {
      var num = $(this).parent().children().not( ".exp" ).length;
      var imgArr = [];
      for (var i=0; i<num; i++) {
        imgArr.push($(this).parent().find('.attachimg').eq(i).data('img'));
      }
      var pnum = $(this).parent().find('.exp').length;
      var index = pnum > 0 ? $(this).index() - pnum : $(this).index();
      var pb = $.photoBrowser({
        items: imgArr,
        initIndex: index
      });
      pb.open();
    });

  },
  methods: {
    statusname: function(status) {
      let name = '';
      switch (status) {
        case 1:
          name = '待质检';
          break;
        case 2:
          name = '内部审批';
          break;
        case 3:
          name = '品控审批';
          break;
        case 4:
          name = '待出库';
          break;
        case 5:
          name = '已出库';
          break;
      }
      return name;
    },
    whinformStatus: function(status) {
      let name = '';
      switch (status) {
        case 1:
          name = '待质检';
          break;
        case 2:
          name = '待入库';
          break;
        case 3:
          name = '已入库';
          break;
      }
      return name;
    },
    getPlan: function (id) {
      this.axios({
        method: 'get',
        url: '/produce/Produceplan!detail.action?openid=' + this.openid,
        params: {guid: id}
      }).then(response => {
        if (response.data.status == 'true') {
          let data = response.data;
          this.plan = data.pp;
          this.plsCollect = data.plsCollect != undefined ? data.plsCollect : [];
          this.pls = data.pls != undefined ? data.pls : [];
          this.scrapsum = data.scrapsum;
          this.scrapweight = data.scrapweight;
          this.scraps = data.scraps != undefined ? data.scraps : [];
          this.materialsum = data.materialsum;
          this.materialweight = data.materialweight;
          this.materials = data.materials != undefined ? data.materials : [];
          if (data.whinforms != undefined) {
            this.whinforms = data.whinforms != undefined ? data.whinforms : [];
            this.hgweight = data.hgweight;
            this.hgsum = data.hgsum;
          }
        } else if (response.data.status == 'false') {
          this.toastError(response.data.result);
        } else {
          this.toastError('系统错误');
        }
      });
    },
  }
}
</script>
